<!doctype html>
<html lang="en" class="fixed">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
    <title>财务明细</title>
    <link rel="apple-touch-icon" sizes="120x120" href="favicon/apple-icon-120x120.png">
    <link rel="icon" type="image/png" sizes="192x192" href="favicon/android-icon-192x192.png">
    <link rel="icon" type="image/png" sizes="32x32" href="favicon/favicon-32x32.png">
    <link rel="icon" type="image/png" sizes="16x16" href="favicon/favicon-16x16.png">
    <link rel="stylesheet" type="text/css"
          href="<?php xcho(loadSource('/assets/plugins/bootstrap/css/bootstrap.min.css')) ?>">
    <link rel="stylesheet" href="<?php xcho(loadSource('/assets/plugins/animate.css/animate.css')) ?>">
    <link rel="stylesheet" href="<?php xcho(loadSource('/assets/plugins/font-awesome/css/font-awesome.css')) ?>">
    <link rel="stylesheet"
          href="<?php xcho(loadSource('/assets/plugins/data-table/media/css/dataTables.bootstrap.min.css')) ?>">
    <!--    <link rel="stylesheet" href="-->
    <?php //xcho(loadSource('/assets/plugins/ztree/css/zTreeStyle/zTreeStyle.css')) ?><!--">-->
    <link rel="stylesheet" href="<?php xcho(loadSource('/assets/plugins/layui/css/layui.css')) ?>" media="all">
    <link rel="stylesheet" href="<?php xcho(loadSource('/assets/plugins/ztree/css/metroStyle/metroStyle.css')) ?>"
          type="text/css">
    <link rel="stylesheet" href="<?php xcho(loadSource('/app/css/style.css')) ?>">
    <link rel="stylesheet" href="<?php xcho(loadSource('/app/css/app.css')) ?>">
    <link rel="stylesheet" href="<?php xcho(loadSource('/assets/css/new_main.css')) ?>">
    <style>
        .layui-form-label{
            width: 110px;
        }
        .pagination {
            margin: 0;
        }

        .content-title {
            /*width: 1200px;*/
            padding: 20px;
            background: #fff;
            margin: 0 auto;
        }

        .content-title .title {
            border-bottom: 1px #ccc solid;
            font-size: 0;
        }

        .content-title .title p {
            width: 60px;
            text-align: center;
            font-size: 14px;
            color: #108EE9;
            display: inline-block;
            position: relative;
        }

        .content-title .title p i {
            width: 70px;
            display: inline-block;
            border-bottom: 2px #108EE9 solid;
            position: absolute;
            bottom: -8px;
            left: 0;
        }

        .content-title .title ul {
            font-size: 0;
            display: inline-block;
            float: right;
            margin-top: -15px;
        }

        .content-title .range {
            margin-top: 10px;
        }

        .content-title .range .layui-form-item label {
            font-size: 12px;
            padding: 6px;
            background: #FBFBFB;
            border: 1px #E8E8E8 solid;
            margin-left: 8px;
            width: initial;
        }

        .content-title .range select {
            width: 80px;
            border: 1px #ccc solid;
            font-size: 10px;
            color: #333;
        }

        .content-title .range select option {
            font-size: 10px;
        }

        .content-title .range input {
            width: 110px;
            height: 34px;
            border: none;
            font-size: 12px;
            border: 1px #ccc solid;
            border-left: none;
            text-indent: 6px;
        }

        .content-title .range div {
            display: inline-block;
            margin-bottom: 0;
        }

        .content-title .canal {
            margin-top: 5px;
        }

        .content-cont {
            /*width: 1200px;*/
            padding: 20px 20px 30px;
            background: #fff;
            margin: 30px auto;
        }

        .content-cont .top_btn .top_more {
            display: inline-block;
            position: relative;
            width: 200px;
        }

        .content-cont .top_btn .top_more button b {
            font-size: 10px;
            color: #fff;
            margin-left: 4px;
        }

        .content-cont .top_btn .top_more ul {
            width: 250px;
            text-align: center;
            padding: 10px;
            background: #fff;
            box-shadow: 0px 0px 5px #ccc;
            position: absolute;
            top: 0;
            left: 102px;
            display: none;
        }

        .content-cont .top_btn .top_more ul li {
            cursor: pointer;
            height: 24px;
            line-height: 24px;
            display: inline-block;

        }

        .content-cont .top_btn .top_btnRight {
            float: right;
        }

        .content-cont .top_pages {
            padding: 3px 15px;
            height: 30px;
            margin-top: 8px;
            font-size: 0;
        }

        .content-cont .top_pages p {
            display: inline-block;
            font-size: 12px;
        }

        .content-cont .top_pages ul {
            font-size: 0;
            display: inline-block;
            float: right;
        }

        .content-cont .top_pages ul li:nth-of-type(1) {
            border: none;
            background: none;
        }

        .content-cont .top_pages ul li:nth-of-type(1):hover {
            background: none;
            color: #999;
        }

        .content-cont .top_pages ul li {
            display: inline-block;
            font-size: 12px;
            background: #fff;
            margin-left: 10px;
            line-height: 24px;
            text-align: center;
            border: 1px #ccc solid;
            border-radius: 6px;
            cursor: pointer;
            color: #999;
        }

        .content-cont .top_pages ul li:last-child {
            border: none;
            background: none;
        }

        .content-cont .top_pages ul li:last-child input {
            width: 50px;
            margin: 0 10px;
            border-radius: 6px;
            border: none;
            border: 1px #ccc solid;
            outline: none;
        }

        .content-cont .top_pages ul li:last-child:hover {
            background: none;
            color: #999;
        }

        .content-cont .top_pages ul li:hover {
            background: #108EE9;
            color: #fff;
        }

        .content-cont .table {
            width: 100%;
            margin-top: 10px;
        }

        .content-cont .table table {
            width: 100%;
        }

        .content-cont .table table thead tr th {
            padding: 10px;
            background: #f2f2f2;
            color: #000;
            text-align: center;
            font-weight: normal;
            border: 1px #e2e2e2 solid;
        }

        .content-cont .table table tbody tr td {
            padding: 8px;
            border: 1px #e2e2e2 solid;
            text-align: center;
        }

        .content-cont .table table tbody tr td:last-child a {
            margin: 0 5px;
            position: relative;
            cursor: pointer;
        }

        .content-cont .table table tbody tr td:last-child a b {
            width: 80px;
            line-height: 24px;
            background: #fff;
            position: absolute;
            bottom: -30px;
            left: -15px;
            font-weight: normal;
            font-size: 10px;
            color: #000;
            border: 1px #ccc solid;
            border-radius: 5px;
            display: none;
            z-index: 10;
        }

        .content-cont .bottom_pages {
            padding: 3px 15px;
            height: 30px;
            margin-top: 8px;
            background: #fff;
            font-size: 0;
        }

        #begin_start_time, #end_start_time {
            height: 34px;
            border: 1px #ccc solid;
            margin-left: 6px;
        }

        .layui-anim > dt {
            cursor: pointer;
        }

        .layui-form-select .layui-select-group dd {
            padding-left: 10px;
        }

        #LAY_layuipro select {
            height: 30px;
            border-radius: 4px;
        }

        .up_area {
            margin-top: 10px;
        }

        .up_area div input {
            width: 100%;
        }

        .layui-input {
            border-radius: 0;
        }
        .layui-input-block{
            margin-left: auto;
        }
    </style>
</head>

<body><?php include_once TPL_PATH . 'public/nav.phtml'; ?>

<div class="">
    <div class="row" >
        <form action="" id="keciList">
            <div class="class-box">
                <div class="content-title">
                    <div class="layui-tab layui-tab-brief" lay-filter="checkTab">
                        <div class="layui-tab-title">
                            <ul class="col-md-8">
                                <?php foreach ($aCheckList as $aTmp) { ?>
                                    <li lay-id="<?php xcho($aTmp['dict_value']) ?>"
                                        <?php if ($aTmp['dict_value'] == $aSearch['receipt_status']) { ?>
                                            class="layui-this"
                                        <?php } ?>><?php xcho($aTmp['cn_name']) ?></li>
                                <?php } ?>
                            </ul>
                            <div class="input-group col-md-4">
                                <input type="text" class="form-control" id="keyword" name="keyword"
                                           value="<?php xcho($aSearch['keyword']) ?>" placeholder="可搜索学员名">
                                <span class="input-group-btn">
                                    <input type="submit" id="search" class="btn btn-primary edit" url="<?php xcho($sSearchAction) ?>" value="搜索"  />
                                </span>

                            </div>
                        </div>
                    </div>
                    <div class="layui-collapse" lay-accordion>
                        <div class="layui-colla-item">
                            <h2 class="layui-colla-title">搜索条件</h2>
                            <div class="layui-colla-content">
                                <div class="layui-form range">
                                    <div class="layui-form-item">
                                        <label class="layui-form-label">查看范围：</label>
                                        <input results="s" class="group-picker" id="scale_name" name="scale_name" type="search"
                                               value="<?php xcho($aSearch['scale_name']) ?>" url="<?php xcho($sSearchRange) ?>">
                                        <input results="s" id="scale_type" name="scale_type" type="hidden"
                                               value="<?php xcho($aSearch['scale_type']) ?>">
                                        <input results="s" id="scale_id" name="scale_id" type="hidden"
                                               value="<?php xcho($aSearch['scale_id']) ?>">
                                        <input results="s" id="receipt_status" name="receipt_status" type="hidden"
                                               value="<?php xcho($aSearch['receipt_status']) ?>">
                                    </div>
                                    <div class="layui-form-item">
                                        <label class="layui-form-label">收费日期：</label>
                                        <select name="date_type" id="date_type" lay-filter="date_type">
                                            <option value="">全部</option>
                                            <?php foreach ($aDateType as $aTmp) { ?>
                                                <option value="<?php xcho($aTmp['dict_value']) ?>"
                                                    <?php if ($aTmp['dict_value'] == $aSearch['date_type']) { ?>
                                                        selected="selected"
                                                    <?php } ?>><?php xcho($aTmp['cn_name']) ?></option>
                                            <?php } ?>
                                        </select>
                                    </div>
                                    <div class="layui-inline"> <!-- 注意：这一层元素并不是必须的 -->
                                        <input type="text" class="layui-input" id="begin_start_time" name="begin_start_time"
                                               value="<?php xcho($aSearch['begin_start_time']) ?>" placeholder="年/月/日">
                                    </div>
                                    <div class="layui-inline"> <!-- 注意：这一层元素并不是必须的 -->
                                        <input type="text" class="layui-input" id="end_start_time" name="end_start_time"
                                               value="<?php xcho($aSearch['end_start_time']) ?>" placeholder="年/月/日">
                                    </div>
                                    <div class="layui-form-item">
                                        <label class="layui-form-label">课程：</label>
                                        <input results="s" id="course_name" name="course_name" type="search"
                                               value="<?php xcho($aSearch['course_name']) ?>" url="<?php xcho($sSearchCourse) ?>">
                                        <input results="s" id="course_id" name="course_id" type="hidden"
                                               value="<?php xcho($aSearch['course_id']) ?>">
                                    </div>
                                    <div class="layui-form range canal">
                                        <div class="layui-form-item">
                                            <label class="layui-form-label">购课类型：</label>
                                            <select name="order_type" id="order_type">
                                                <option value="">全部</option>
                                                <?php foreach ($aOrderType as $aTmp) { ?>
                                                    <option value="<?php xcho($aTmp['dict_value']) ?>"
                                                        <?php if ($aTmp['dict_value'] == $aSearch['order_type']) { ?>
                                                            selected="selected"
                                                        <?php } ?>><?php xcho($aTmp['cn_name']) ?></option>
                                                <?php } ?>
                                            </select>
                                        </div>
                                    </div>
                                    <div style="width: 100%">
                                        <?php if(!empty($aChannel)) {?>
                                        <a href="#" id="toggle">渠道展开</a>
                                        <div id="content" style="display: none;">
                                        <div class="layui-form">
                                            <label>渠道：</label>
                                            <?php foreach ($aChannel as  $aTmp) { ?>
                                                <div class="layui-input-block">
                                                    <input type="checkbox" title="<?php xcho($aTmp['cn_name']) ?>"
                                                           name="channel_id[]" <?php if (!empty($aSearch['channel_id'])
                                                        && in_array($aTmp['id'],$aSearch['channel_id'])) {?> checked <?php } ?>
                                                           lay-skin="primary" value="<?php xcho($aTmp['id']) ?>">
                                                </div>
                                            <?php } ?>
                                        </div>
                                        <div>
                                        <?php } ?>

                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="class-box">
                <div class="class-box-head">
                    <div class="class-box-title">
                        <h3>列表</h3>
                    </div>
                </div>

                <div class="row pagination-wrap">
                    <div class="col-sm-6">

                        <div class="pagination-group col-sm-12">
                            <input class="form-control" style="width: 110px;" type="number" min="1"
                                   max="<?php xcho($iMaxPage) ?>" name="now_page" placeholder="请输入页码"
                                   value="<?php xcho($iNowPage) ?>"/>
                            <span>共搜索到<?php xcho($iTotalNum) ?>条记录</span>
                        </div>
                    </div>
                    <div class="col-sm-6">
                        <ul class="pagination">
                            <?php xchoHtml($aOrderOrder->render()) ?>
                        </ul>
                    </div>
                </div>
                <div class="layui-form table">
                    <table class="layui-form table table-bordered table-hover table table-bordered table-striped">
                        <thead>
                        <tr>
                            <th><input type="checkbox" lay-filter="allChoose" lay-skin="primary"
                                       name="checkAll">
                            <th>订单ID</th>
                            <th>学员名称</th>
                            <th>课程</th>
                            <th>类型</th>
                            <th>金额</th>
                            <th>渠道来源</th>
                            <th>TMK负责人</th>
                            <th>CC负责人</th>
                            <th>收费时间</th>
                            <th>操作</th>
                        </tr>
                        </thead>
                        <tbody>
                        <?php foreach ($aOrderOrder as $aKey) { ?>
                            <?php foreach ($aOrders as $aOrder) { ?>
                                <?php if ($aOrder['id'] == $aKey['id']) { ?>
                                    <tr>
                                        <td><input type="checkbox" lay-filter="itemChoose" name="ck"
                                                   lay-skin="primary" id="<?php xcho($aOrder['id']) ?>"></td>
                                        <td>
                                            <?php xcho($aOrder['id']) ?>
                                        </td>
                                        <td>
                                            <a href="<?php xcho($aOrder['student_url']) ?>">
                                                <?php xcho($aOrder['student_name']) ?>
                                            </a>
                                        </td>
                                        <td>
                                            <?php foreach ($aOrder['course'] as $aTmp) { ?>
                                                <a href="<?php xcho($aTmp['course_url']) ?>">
                                                    <?php xcho($aTmp['course_name']) ?>
                                                </a>
                                                <br/>
                                            <?php } ?>
                                        </td>
                                        <td>
                                            <?php foreach ($aOrder['course'] as $aTmp) { ?>
                                                <?php xcho($aTmp['order_type_str']) ?>
                                                <br/>
                                            <?php } ?>
                                        </td>
                                        <td>
                                            <?php xcho($aOrder['income']) ?>
                                        </td>
                                        <td>
                                            <?php xcho($aOrder['channel_str']) ?>
                                        </td>
                                        <td>
                                            <?php xcho($aOrder['tmk_str']) ?>
                                        </td>
                                        <td>
                                            <?php xcho($aOrder['cc_str']) ?>
                                        </td>
                                        <td>
                                            <?php xcho($aOrder['pay_time_str']) ?>
                                        </td>

                                        <td>
                                            <?php if (isset($aOrder['bujiao_url'])) { ?>
                                                <a class="layui-btn layui-btn-mini bujiao"
                                                   keyid="<?php xcho($aOrder['id']) ?>"
                                                   url="<?php xcho($aOrder['bujiao_url']) ?>"
                                                   ajax_url="<?php xcho($aOrder['bujiao_ajax_url']) ?>">
                                                    补交
                                                </a>
                                            <?php } ?>
                                            <?php if (isset($aOrder['kaipiao']['url'])) { ?>
                                                <a class="layui-btn layui-btn-mini kaipiao"
                                                   keyid="<?php xcho($aOrder['id']) ?>"
                                                   url="<?php xcho($aOrder['kaipiao']['url']) ?>"
                                                   status_submit="<?php xcho($aOrder['kaipiao']['receipt_status_submit']) ?>">
                                                    开票
                                                </a>
                                            <?php } ?>
                                            <?php if (isset($aOrder['check']['url'])) { ?>
                                                <a class="layui-btn layui-btn-mini shencha"
                                                   keyid="<?php xcho($aOrder['id']) ?>"
                                                   url="<?php xcho($aOrder['check']['url']) ?>">
                                                    审查
                                                </a>
                                            <?php } ?>
                                            <?php if (isset($aOrder['jijian_url'])) { ?>
                                                <a class="layui-btn layui-btn-mini jijian"
                                                   keyid="<?php xcho($aOrder['id']) ?>"
                                                   url="<?php xcho($aOrder['jijian_url']) ?>">
                                                    寄件
                                                </a>
                                            <?php } ?>
                                            <?php if (isset($aOrder['edit']['url'])) { ?>
                                                <a class="layui-btn layui-btn-mini bianji"
                                                   keyid="<?php xcho($aOrder['id']) ?>"
                                                   url="<?php xcho($aOrder['edit']['url']) ?>"
                                                   status_submit="<?php xcho($aOrder['edit']['receipt_status_submit']) ?>"
                                                   status_default="<?php xcho($aOrder['edit']['receipt_status_default']) ?>"
                                                   ajax_url="<?php xcho($aOrder['edit']['ajax_url']) ?>">
                                                    编辑
                                                </a>
                                            <?php } ?>
                                            <?php if (isset($aOrder['rkaipiao']['url'])) { ?>
                                                <a class="layui-btn layui-btn-mini rkaipiao"
                                                   keyid="<?php xcho($aOrder['id']) ?>"
                                                   url="<?php xcho($aOrder['rkaipiao']['url']) ?>"
                                                   status_submit="<?php xcho($aOrder['rkaipiao']['receipt_status_submit']) ?>"
                                                   status_default="<?php xcho($aOrder['rkaipiao']['receipt_status_default']) ?>">
                                                    重新提交
                                                </a>
                                            <?php } ?>
                                            <?php if (isset($aOrder['view_url'])) { ?>
                                                <a class="layui-btn layui-btn-mini layui-btn-warm"
                                                   href="<?php xcho($aOrder['view_url']) ?>">
                                                    详情
                                                </a>
                                            <?php } ?>
                                            <?php if (isset($aOrder['del'])) { ?>
                                                <a class="layui-btn layui-btn-mini layui-btn-danger cancel"
                                                   lay-event="del"
                                                   url="<?php xcho($aOrder['del']['url']); ?>"
                                                   keyid="<?php xcho($aOrder['id']) ?>"
                                                   actions="<?php xcho($aOrder['del']['actions']) ?>">
                                                    撤单
                                                </a>
                                            <?php } ?>
                                        </td>
                                    </tr>
                                <?php } ?>
                            <?php } ?>
                        <?php } ?>
                        </tbody>
                    </table>
                </div>
            </div>
        </form>
    </div>
</div>
</div>
<div class="modal fade" id="info-modal-group" tabindex="-1" role="dialog" aria-labelledby="modal-info-label">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header state modal-info">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="modal-info-label"><i class="fa fa-info"></i></h4>
            </div>
            <div class="modal-body" style="min-height: 150px;">
                <ul id="treeDemo" class="ztree">
                    <!--<option value="">全部</option>
                    <option value="all">所有学员</option>
                    <option value="mine">我的学员</option>
                    <option value="follower">下属的学员</option>
                    <option value="create">下属的学员</option>-->
                </ul>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-info" id="sureGroup" data-dismiss="modal">确定</button>
                <button type="button" class="btn btn-default" id="returnGroup" data-dismiss="modal">返回</button>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" id="bujiao-group" tabindex="-1" role="dialog" aria-labelledby="modal-info-label">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header state modal-info">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title" id="modal-info-label"><i class="fa fa-info"></i></h4>
            </div>
            <div class="modal-body layui-form" style="min-height: 150px;">
                <div class="layui-form-item">
                    <label class="layui-form-label">补交</label>
                    <div class="layui-input-block">
                        <input type="text" name="price" required  lay-verify="required" placeholder="收费金额" autocomplete="off" class="layui-input">
                        <input type="hidden" name="save_pay_url" >
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">支付方式</label>
                    <div class="layui-input-block">
                        <select id="ptype" name="ptype" lay-verify="required">
                            <option value=""></option>
                            <?php foreach ($aPtype as $aTmp) { ?>
                                <option value="<?php xcho($aTmp['dict_value']) ?>"><?php xcho($aTmp['cn_name']) ?></option>
                            <?php } ?>
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">待收</label>
                    <div class="layui-form-mid layui-word-aux" id="bujiao_val"></div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">收费日期</label>
                    <div class="layui-input-block">
                        <input type="text" id="ptime" name="ptime" required  lay-verify="required" placeholder="收费金额" autocomplete="off" class="layui-input">
                    </div>
                </div>

                <div class="layui-form-item layui-form-text">
                    <label class="layui-form-label">添加备注</label>
                    <div class="layui-input-block">
                        <textarea id="remark" name="remark" placeholder="请输入备注" class="layui-textarea"></textarea>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <span type="button" class="btn btn-info" id="saveBujiao" data-dismiss="modal">确定</span>
                <span type="button" class="btn btn-default" id="returnBujiao" data-dismiss="modal">返回</span>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" id="kaipiao-group" tabindex="-1" role="dialog" aria-labelledby="modal-info-label">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header state modal-info">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title" id="modal-info-label"><i class="fa fa-info"></i></h4>
            </div>
            <div class="modal-body layui-form" style="min-height: 150px;">
                <div class="layui-form-item">
                    <label class="layui-form-label">发票抬头</label>
                    <div class="layui-input-block">
                        <select id="receipt_title_type" name="receipt_title_type">
                            <option value=""></option>
                            <?php foreach ($aReceiptType as $aTmp) { ?>
                                <option value="<?php xcho($aTmp['dict_value']) ?>"><?php xcho($aTmp['cn_name']) ?></option>
                            <?php } ?>
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">抬头信息</label>
                    <div class="layui-input-block">
                        <input type="text" id="receipt_title" name="receipt_title" required
                               lay-verify="required" placeholder="" autocomplete="off" class="layui-input">
                    </div>
                </div>

                <div class="layui-form-item layui-form-text">
                    <label class="layui-form-label">添加备注</label>
                    <div class="layui-input-block">
                        <textarea id="receipt_remark" name="receipt_remark" placeholder="请输入备注" class="layui-textarea"></textarea>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <span type="button" class="btn btn-info" id="saveKaipiao" data-dismiss="modal" url="" status="">确定</span>
                <span type="button" class="btn btn-default" id="returnKaipiao" data-dismiss="modal">取消</span>
                <span type="button" class="btn btn-default btn-danger" id="cancelKaipiao" style="display: none" data-dismiss="modal" url="" status="">取消开票</span>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" id="check-group" tabindex="-1" role="dialog" aria-labelledby="modal-info-label">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header state modal-info">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title" id="modal-info-label"><i class="fa fa-info"></i></h4>
            </div>
            <div class="modal-body layui-form" style="min-height: 150px;">
                <div class="layui-form-item">
                    <label class="layui-form-label">审核状态</label>
                    <div class="layui-input-block">
                        <select id="check_receipt_status" name="check_receipt_status" lay-verify="required">
                            <option value=""></option>
                            <?php foreach ($aCheckList as $aTmp) {
                                if($aTmp['dict_value'] != 'default') {?>
                                <option value="<?php xcho($aTmp['dict_value']) ?>"><?php xcho($aTmp['cn_name']) ?></option>
                            <?php } } ?>
                        </select>
                    </div>
                </div>
                <div class="layui-form-item layui-form-text">
                    <label class="layui-form-label">审查备注</label>
                    <div class="layui-input-block">
                        <textarea id="check_remark" name="check_remark" placeholder="请输入备注" class="layui-textarea"></textarea>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <span type="button" class="btn btn-info" id="saveCheck" data-dismiss="modal" url="">确定</span>
                <span type="button" class="btn btn-default" id="returnCheck" data-dismiss="modal">取消</span>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" id="jijian-group" tabindex="-1" role="dialog" aria-labelledby="modal-info-label">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header state modal-info">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title" id="modal-info-label"><i class="fa fa-info"></i></h4>
            </div>
            <div class="modal-body layui-form" style="min-height: 150px;">
                <div class="layui-form-item">
                    <label class="layui-form-label">寄件码</label>
                    <div class="layui-input-block">
                        <input id="mail_code" name="mail_code" lay-verify="required">
                    </div>
                </div>
                <div class="layui-form-item layui-form-text">
                    <label class="layui-form-label">寄件地址</label>
                    <div class="layui-input-block">
                        <textarea id="mail_address" name="mail_address" placeholder="寄件地址" class="layui-textarea"></textarea>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <span type="button" class="btn btn-info" id="savejijian" data-dismiss="modal" url="">确定</span>
                <span type="button" class="btn btn-default" id="returnjijian" data-dismiss="modal">取消</span>
            </div>
        </div>
    </div>
</div>
<input type="hidden" id="order_id" name="order_id" >
<script src="<?php xcho(loadSource('/assets/plugins/jquery/jquery.min.js')) ?>"></script>
<script src="<?php xcho(loadSource('/assets/plugins/layui/layui.all.js')) ?>" charset="utf-8"></script>
<script src="<?php xcho(loadSource('/assets/plugins/bootstrap/js/bootstrap.min.js')) ?>"></script>
<script src="<?php xcho(loadSource('/assets/plugins/data-table/media/js/jquery.dataTables.min.js')) ?>"></script>
<script src="<?php xcho(loadSource('/assets/plugins/data-table/media/js/dataTables.bootstrap.min.js')) ?>"></script>
<script src="<?php xcho(loadSource('/assets/plugins/layer-v3.0.3/layer/layer.js')) ?>"></script>
<script
        src="<?php xcho(loadSource('/assets/plugins/data-table/extensions/Responsive/js/dataTables.responsive.min.js')) ?>"></script>
<script
        src="<?php xcho(loadSource('/assets/plugins/data-table/extensions/Responsive/js/responsive.bootstrap.min.js')) ?>"></script>
<script src="<?php xcho(loadSource('/assets/plugins/ztree/js/jquery.ztree.core.js')) ?>"></script>
<script type="text/javascript"
        src="<?php xcho(loadSource('/assets/plugins/ztree/js/jquery.ztree.excheck.js')) ?>"></script>
<script type="text/javascript"
        src="<?php xcho(loadSource('/assets/plugins/ztree/js/jquery.ztree.exedit.js')) ?>"></script>
<script>


    $(function () {
        $("#toggle").click(function() {
            $(this).text($("#content").is(":hidden") ? "渠道收起" : "渠道展开");
            $("#content").slideToggle();
        });
    })

    layui.use(['layer', 'form', 'laydate','element'], function () {
        var layer = layui.layer
            , form = layui.form
            ,element = layui.element;
        var laydate = layui.laydate;
        laydate.render({
            elem:"#ptime"
        });
        form.on("select(date_type)", function (data) {
            var ddVal = data.value;
            if (ddVal == "define") {
                $("#begin_start_time").val("");
                $("#end_start_time").val("");
                //执行一个laydate实例
                laydate.render({
                    elem: '#end_start_time', //指定元素
                    showBottom: false
                });
                //执行一个laydate实例
                laydate.render({
                    elem: '#begin_start_time', //指定元素
                    showBottom: false,
                });
            } else {
                var aDate = getDates(ddVal);
                $("#begin_start_time").val(aDate['sStartDate']);
                $("#end_start_time").val(aDate['sEndDate']);
            }
        })
        form.on('checkbox(allChoose)', function (data) {
            var child = $(data.elem).parents('table').find('tbody input[type="checkbox"]');
            child.each(function (index, item) {
                item.checked = data.elem.checked;
            });
            form.render('checkbox');
        });
        form.on('checkbox(itemChoose)', function (data) {
            var sib = $(data.elem).parents('table').find('tbody input[type="checkbox"]:checked').length;
            var total = $(data.elem).parents('table').find('tbody input[type="checkbox"]').length;
            if (sib == total) {
                $(data.elem).parents('table').find('thead input[type="checkbox"]').prop("checked", true);
                form.render();
            } else {
                $(data.elem).parents('table').find('thead input[type="checkbox"]').prop("checked", false);
                form.render();
            }
        });
        $(".group-picker").focus(function(){
            $('#info-modal-group').modal({
                keyboard: false,
                backdrop:false
            });
            $('#info-modal-group').on('shown.bs.modal', function (e) {
                // 关键代码，如没将modal设置为 block，则$modala_dialog.height() 为零
                $(this).css('display', 'block');
                $(this).find('.modal-dialog').css({
                    'margin-top': "100px"
                });
            });
        });
        element.on('tab(checkTab)', function(data){
            $("#receipt_status").val(this.getAttribute('lay-id'));
            $('#search').click();
        });

        $(".bujiao").on('click',function () {
            $('#bujiao-group').modal({
                keyboard: false,
                backdrop: false
            });
            $('#bujiao-group').on('shown.bs.modal', function (e) {
                // 关键代码，如没将modal设置为 block，则$modala_dialog.height() 为零
                $(this).css('display', 'block');
                $(this).find('.modal-dialog').css({
                    'margin-top': "100px"
                });
            });
            $("input[name='order_id']").val($(this).attr('keyid'));
            $("input[name='save_pay_url']").val($(this).attr('url'));
            $.ajax({
                url: $(this).attr('ajax_url'),
                data: {},
                type: 'get',
                dataType: 'json',
                success: function (data) {
                    if (data.success == 1) {
                        $("#bujiao_val").text((data.data.real_price-data.data.income)/100);
                    } else {

                    }
                },
                complete: function () {
                },
                error: function () {

                }
            });
        });
        $(".kaipiao").on('click',function () {
            $('#kaipiao-group').modal({
                keyboard: false,
                backdrop: false
            });
            $('#kaipiao-group').on('shown.bs.modal', function (e) {
                // 关键代码，如没将modal设置为 block，则$modala_dialog.height() 为零
                $(this).css('display', 'block');
                $(this).find('.modal-dialog').css({
                    'margin-top': "100px"
                });
            });
            $("input[name='order_id']").val($(this).attr('keyid'));
            $("#saveKaipiao").attr('url',$(this).attr('url'));
            $("#saveKaipiao").attr('status',$(this).attr('status_submit'));
        });
        $(".bianji").on('click',function () {
            $('#kaipiao-group').modal({
                keyboard: false,
                backdrop: false
            });
            $('#kaipiao-group').on('shown.bs.modal', function (e) {
                // 关键代码，如没将modal设置为 block，则$modala_dialog.height() 为零
                $(this).css('display', 'block');
                $(this).find('.modal-dialog').css({
                    'margin-top': "100px"
                });
            });
            $('#cancelKaipiao').css('display', 'block');
            $("#order_id").val($(this).attr('keyid'));
            $("#saveKaipiao").attr('url',$(this).attr('url'));
            $("#saveKaipiao").attr('status',$(this).attr('status_submit'));
            $("#cancelKaipiao").attr('url',$(this).attr('url'));
            $("#cancelKaipiao").attr('status',$(this).attr('status_default'));
            $.ajax({
                url: $(this).attr('ajax_url'),
                data: {},
                type: 'get',
                dataType: 'json',
                success: function (data) {
                    if (data.success == 1) {
                        $("#receipt_title_type").val(data.data.receipt_title_type);
                        form.render('select');//更新select渲染
                        $("#receipt_title").val(data.data.receipt_title);
                        $("#receipt_remark").val(data.data.receipt_remark);
                    } else {

                    }
                },
                complete: function () {
                },
                error: function () {

                }
            });
        });
        $(".rkaipiao").on('click',function () {
            $('#kaipiao-group').modal({
                keyboard: false,
                backdrop: false
            });
            $('#kaipiao-group').on('shown.bs.modal', function (e) {
                // 关键代码，如没将modal设置为 block，则$modala_dialog.height() 为零
                $(this).css('display', 'block');
                $(this).find('.modal-dialog').css({
                    'margin-top': "100px"
                });
            });
            $('#cancelKaipiao').css('display', 'block');
            $("#order_id").val($(this).attr('keyid'));
            $("#saveKaipiao").attr('url',$(this).attr('url'));
            $("#saveKaipiao").attr('status',$(this).attr('status_submit'));
            $("#cancelKaipiao").attr('url',$(this).attr('url'));
            $("#cancelKaipiao").attr('status',$(this).attr('status_default'));
        });
        $(".shencha").on('click',function () {
            $('#check-group').modal({
                keyboard: false,
                backdrop: false
            });
            $('#check-group').on('shown.bs.modal', function (e) {
                // 关键代码，如没将modal设置为 block，则$modala_dialog.height() 为零
                $(this).css('display', 'block');
                $(this).find('.modal-dialog').css({
                    'margin-top': "100px"
                });
            });
            $("#order_id").val($(this).attr('keyid'));
            $("#saveCheck").attr('url',$(this).attr('url'));
        });
        $(".jijian").on('click',function () {
            $('#jijian-group').modal({
                keyboard: false,
                backdrop: false
            });
            $('#jijian-group').on('shown.bs.modal', function (e) {
                // 关键代码，如没将modal设置为 block，则$modala_dialog.height() 为零
                $(this).css('display', 'block');
                $(this).find('.modal-dialog').css({
                    'margin-top': "100px"
                });
            });
            $("#order_id").val($(this).attr('keyid'));
            $("#savejijian").attr('url',$(this).attr('url'));
        });
    });

    $("#saveBujiao").on('click',function () {
        var aData = {
            'order_id':$("input[name='order_id']").val(),
            'price':parseInt($("input[name='price']").val())*100,
            'ptype':$("#ptype").find("option:selected").attr("value"),
            'ptime':$("input[name='ptime']").val(),
            'remark':$("#remark").val(),
        };
        $.ajax({
            url:$("input[name='save_pay_url']").val(),
            data:aData,
            type:'POST',
            dataType: 'json',
            success:function (data) {
                if (data.success == 1) {
                    layer.msg('补交成功');
                    setTimeout(function(){ window.location.reload(); }, 3000);
                } else {
                    layer.msg("补交失败");
                }
            }
        });
    })


    $("#saveKaipiao").on('click',function () {
        var aData = {
            'id':$("input[name='order_id']").val(),
            'receipt_title_type':$("#receipt_title_type").find("option:selected").attr("value"),
            'receipt_title':$("#receipt_title").val(),
            'receipt_remark':$("#receipt_remark").val(),
            'receipt_status':$(this).attr('status'),
        };
        $.ajax({
            url:$(this).attr('url'),
            data:aData,
            type:'POST',
            dataType: 'json',
            success:function (data) {
                if (data.success == 1) {
                    layer.msg('操作成功');
                    setTimeout(function(){ window.location.reload(); }, 3000);
                } else {
                    layer.msg("操作失败");
                }
            }
        });
    })

    $("#cancelKaipiao").on('click',function () {
        var aData = {
            'id':$("input[name='order_id']").val(),
            'receipt_title_type':$("#receipt_title_type").find("option:selected").attr("value"),
            'receipt_title':$("#receipt_title").val(),
            'receipt_remark':$("#receipt_remark").val(),
            'receipt_status':$(this).attr('status'),
        };
        $.ajax({
            url:$(this).attr('url'),
            data:aData,
            type:'POST',
            dataType: 'json',
            success:function (data) {
                if (data.success == 1) {
                    layer.msg('操作成功');
                    setTimeout(function(){ window.location.reload(); }, 3000);
                } else {
                    layer.msg("操作失败");
                }
            }
        });
    });

    //审查操作saveCheck
    $("#saveCheck").on('click',function () {
        var aData = {
            'order_id':$("input[name='order_id']").val(),
            'status':$("#check_receipt_status").find("option:selected").attr("value"),
            'remark':$("#check_remark").val(),
        };
        $.ajax({
            url:$(this).attr('url'),
            data:aData,
            type:'POST',
            dataType: 'json',
            success:function (data) {
                if (data.success == 1) {
                    layer.msg('操作成功');
                    setTimeout(function(){ window.location.reload(); }, 3000);
                } else {
                    layer.msg("操作失败");
                }
            }
        });
    });
    //寄件操作saveCheck
    $("#savejijian").on('click',function () {
        var aData = {
            'id':$("input[name='order_id']").val(),
            'mail_code':$("#mail_code").val(),
            'mail_address':$("#mail_address").val(),
        };
        $.ajax({
            url:$(this).attr('url'),
            data:aData,
            type:'POST',
            dataType: 'json',
            success:function (data) {
                if (data.success == 1) {
                    layer.msg('操作成功');
                    setTimeout(function(){ window.location.reload(); }, 3000);
                } else {
                    layer.msg("操作失败");
                }
            }
        });
    });


    //删除
    $(".cancel").click(function () {
        var delVal = $(this).attr("url"),
            keyId = $(this).attr("keyid"),
            actions = $(this).attr("actions");
        layer.confirm('确定撤单吗？', {icon: 3, title:'提示'}, function(index){
            $.ajax({
                url: delVal,
                data: {
                    id: keyId,
                    actions: actions,
                },
                type: 'POST',
                dataType: 'json',
                success: function (data) {
                    if (data.success == 1) {
                        layer.msg("撤销成功");
                        setTimeout(function(){ window.location.reload(); }, 3000);
                    } else {
                        layer.msg("撤销失败");
                    }
                }
            })
        });
    })
    //搜索-form表单提交
    $("#search").click(function () {
        $("input[name='now_page']").val($("input:focus").val());
        $("#keciList").submit();
    })
    $("#search").bind('keyup', function (event) {
        if (event.keyCode == "13") {
            $("input[name='now_page']").val($("input:focus").val());
            //回车执行查询
            $('#search').click();
        }
    })
    $("table tr>td>a").hover(function () {
        $(this).find("b").show();
    }, function () {
        $(this).find("b").hide();
    })

    $(".top_more").hover(function () {
        $(this).find("ul").show();
    }, function () {
        $(this).find("ul").hide();
    })
    /*$(".layui-anim>dt").click(function(){
     $(this).nextAll("dd").toggle();
     })*/
    $("#course_name").focus(function () {
        var index = layer.open({
            type: 2
            , title: false //不显示标题栏
            , closeBtn: false
            , area: 'auto'
            , shade: 0.8
            , id: 'LAY_layuipro' //设定一个id，防止重复弹出
            , btn: ['确定', '取消']
            , moveType: 1 //拖拽模式，0或者1
            , content: $(this).attr('url')
        });
        layer.full(index);
    });
    $("#teacher_name").focus(function () {
        var index = layer.open({
            type: 2
            , title: false //不显示标题栏
            , closeBtn: false
            , area: 'auto'
            , shade: 0.8
            , id: 'LAY_layuipro' //设定一个id，防止重复弹出
            , btn: ['确定', '取消']
            , moveType: 1 //拖拽模式，0或者1
            , content: $(this).attr('url')
        });
        layer.full(index);
    });

    //自动获取课程日期或者收费日期
    function getDates(sDateType) {
        var aDate = new Array();
        aDate['sStartDate'] = '';
        aDate['sEndDate'] = '';
        switch (sDateType) {
            case 'month':
                aDate['sStartDate'] = '<?php $BeginDate = date("Y-m-01", strtotime(date("Y-m-d"))); xcho($BeginDate)?>';
                aDate['sEndDate'] = '<?php xcho(date("Y-m-d", strtotime("$BeginDate +1 month -1 day")))?>';
                break;
            case 'sevenday':
                aDate['sStartDate'] = '<?php xcho(date("Y-m-d", strtotime("-7 days")))?>';
                aDate['sEndDate'] = '<?php xcho(date("Y-m-d", strtotime("-1 days")))?>';
                break;
            case 'thirtyday':
                aDate['sStartDate'] = '<?php xcho(date("Y-m-d", strtotime("-30 days")))?>';
                aDate['sEndDate'] = '<?php xcho(date("Y-m-d", strtotime("-1 days")))?>';
                break;
            case 'today':
                aDate['sStartDate'] = '<?php xcho(date("Y-m-d"))?>';
                aDate['sEndDate'] = '<?php xcho(date("Y-m-d"))?>';
                break;
            case 'week':
                aDate['sStartDate'] = '<?php xcho(date("Y-m-d", strtotime("this week")))?>';
                aDate['sEndDate'] = '<?php xcho(date("Y-m-d", strtotime("this week +6 day")))?>';
                break;
            default:
                aDate['sStartDate'] = '<?php xcho(date("Y-m-d", strtotime("-1 days")))?>';
                aDate['sEndDate'] = '<?php xcho(date("Y-m-d", strtotime("-1 days")))?>';
                break;
        }
        return aDate;
    }
    var setting = {
        view: {
            selectedMulti: false,
            addHoverDom: addHoverDom,
            removeHoverDom:removeHoverDom
        },
        edit: {
            enable: true
        },
        data: {
            keep: {
                parent:true,
                leaf:true
            },
            simpleData: {
                enable: true
            }
        },
        callback: {
            beforeDrag: beforeDrag,
            beforeRemove: beforeRemove,
//          beforeRename: beforeRename,
            onRemove: onRemove,
            onClick:zTreeOnClick
        }
    };
    var settingGroup = {
        view: {
            selectedMulti: false
        },
        edit: {
            enable: false
        },
        data: {
            keep: {
                parent:true,
                leaf:true
            },
            simpleData: {
                enable: true
            }
        }
    };
    var log, className = "dark";
    function beforeDrag(treeId, treeNodes) {
        return false;
    }
    //选中赋值到input中
    function zTreeOnClick(event,treeId,treeNode){
        // alert(treeNode.tId + "," + treeNode.name);
        $(".group-picker").val(treeNode.name);
        $("#scale_type").val(treeNode.scale_type);
        $("#scale_id").val(treeNode.id);
    }
    function beforeRemove(treeId, treeNode) {
        className = (className === "dark" ? "":"dark");
        //console.log("[ beforeRemove ]&nbsp;&nbsp;&nbsp;&nbsp; " + treeNode.name);
        var zTree = $.fn.zTree.getZTreeObj("treeDemo");
        zTree.selectNode(treeNode);
        return confirm("确认删除 " + treeNode.name + " 吗？");
    }
    var IDMark_Switch = "_switch",
        IDMark_Icon = "_ico",
        IDMark_Span = "_span",
        IDMark_Input = "_input",
        IDMark_Check = "_check",
        IDMark_Edit = "_edit",
        IDMark_Remove = "_remove",
        IDMark_Ul = "_ul",
        IDMark_A = "_a";
    function addHoverDom(treeId, treeNode) {
        if (treeNode.parentNode && treeNode.parentNode.id!=1) return;
        var aObj = $("#" + treeNode.tId + IDMark_A);
        if ($("#diyBtn_"+treeNode.id).length>0) return;
        var editStr = "<a id='diyBtn_" +treeNode.id+ "' title='"+treeNode.name+"' onfocus='this.blur();'>编辑</a>";
        aObj.append(editStr);
        var btn = $("#diyBtn_"+treeNode.id);
        if (btn) btn.bind("click", function(){
            editNode(treeNode)
        });

    }
    function removeHoverDom(treeId, treeNode) {
        $("#diyBtn_"+treeNode.id).unbind().remove();
        $("#diyBtn_space_" +treeNode.id).unbind().remove();
    };
    function onRemove(e, treeId, treeNode) {
        //console.log("onRemove ]&nbsp;&nbsp;&nbsp;&nbsp; " + treeNode.id);
        $.ajax({
            url: $("input[name='del_group_info']").val(),
            data:{
                id:treeNode.id
            },
            type: 'post',
            dataType: 'json',
            success: function (data) {
                //console.log(data)
                if(data.success == 1){
                    layer.alert("删除成功!")
                }else{
                    alert(data.msg);
                }
            },
            complete:function(){
                location.reload();
            },
            error: function () {

            }
        });
    }
    function beforeRename(treeId, treeNode, newName) {
//            if (newName.length == 0) {
//                alert("节点名称不能为空.");
//                var zTree = $.fn.zTree.getZTreeObj("treeDemo");
//                setTimeout(function(){zTree.editName(treeNode)}, 10);
//                return false;
//            }
        editNode(treeNode);
        return true;
    }

    var newCount = 1;
    function add(e) {
        var zTree = $.fn.zTree.getZTreeObj("treeDemo"),
            isParent = e.data.isParent,
            nodes = zTree.getSelectedNodes(),
            treeNode = nodes[0];
        if (treeNode) {
            treeNode = zTree.addNodes(treeNode, {id:(100 + newCount), pId:treeNode.id, isParent:isParent, name:"new node" + (newCount++)});
        } else {
            treeNode = zTree.addNodes(null, {id:(100 + newCount), pId:0, isParent:isParent, name:"new node" + (newCount++)});
        }
        if (treeNode) {
            zTree.editName(treeNode[0]);
        } else {
            layer.alert("叶子节点被锁定，无法增加子节点");
        }
    };
    function edit() {
        var zTree = $.fn.zTree.getZTreeObj("treeDemo"),
            nodes = zTree.getSelectedNodes(),
            treeNode = nodes[0];
        if (nodes.length == 0) {
            layer.alert("请先选择一个节点");
            return;
        }
        zTree.editName(treeNode);
    };
    function remove(e) {
        var zTree = $.fn.zTree.getZTreeObj("treeDemo"),
            nodes = zTree.getSelectedNodes(),
            treeNode = nodes[0];
        if (nodes.length == 0) {
            layer.alert("请先选择一个节点");
            return;
        }
        var callbackFlag = $("#callbackTrigger").attr("checked");
        zTree.removeNode(treeNode, callbackFlag);
    };
    function setEdit() {
        var zTree = $.fn.zTree.getZTreeObj("treeDemo"),
            remove = $("#remove").attr("checked"),
            removeTitle = $.trim($("#removeTitle").get(0).value);
        zTree.setting.edit.showRemoveBtn = remove;
//            zTree.setting.edit.showRenameBtn = rename;
        zTree.setting.edit.removeTitle = removeTitle;
//            zTree.setting.edit.renameTitle = renameTitle;
    }
    function clearChildren(e) {
        var zTree = $.fn.zTree.getZTreeObj("treeDemo"),
            nodes = zTree.getSelectedNodes(),
            treeNode = nodes[0];
        if (nodes.length == 0 || !nodes[0].isParent) {
            alert("请先选择一个父节点");
            return;
        }
        zTree.removeChildNodes(treeNode);
    };
    $(document).ready(function(){
        onLoadZTree();
    });
    function onLoadZTree(){
        var treeNodes;
        $.ajax({
            url: $(".group-picker").attr('url'),
            type: 'get',
            async:false,
            dataType: 'json',
            success:function(data){
                //console.log(data);
                //请求成功后处理函数
                treeNodes = data.data_list.aGroup;//把后台封装好的简单Json格式赋给treeNodes

            }
        });
        var t = $("#treeDemo");
        t = $.fn.zTree.init(t, setting, treeNodes);
    }
</script>
<?php include_once TPL_PATH . 'public/foot_script.phtml'; ?>
<button id="top" style="height: 50px;width: 50px;"></button></body>

</html>
